Skip to content

refactor(view): MUI ThemeProvider 통합 및 테마 시스템 개선#1016

Merged
nxnaxx merged 6 commits into
githru:mainfrom
nxnaxx:refactor/#1011_theme-system
Oct 28, 2025
Merged

refactor(view): MUI ThemeProvider 통합 및 테마 시스템 개선#1016
nxnaxx merged 6 commits into
githru:mainfrom
nxnaxx:refactor/#1011_theme-system

Conversation

@nxnaxx

@nxnaxx nxnaxx commented Oct 23, 2025

Copy link
Copy Markdown
Contributor

Related issue

#1011

Result

CSS 변수 기반 테마 시스템을 MUI ThemeProvider와 통합하여 일관된 테마 관리 구조를 확립했습니다.

Work list

1. MUI 패키지 업그레이드

  • MUI의 CSS 변수 자동 생성 기능을 사용하기 위함
  • @mui/material: v5.16.6 -> v6.5.0(latest-v6)
  • @mui/icons-material: v5.16.6 -> v6.5.0(latest-v6)

2. 테마 시스템 구조 개선

  • 테마 설정 중앙화 (src/theme/)
    • 테마 타입 정의, 색상 팔레트 구성, MUI 테마 유틸리티 구현
    • cssVariables: true 옵션으로 MUI CSS 변수 자동 생성
    • theme path alias 추가
  • 색상 체계 개선
    • primary, secondary에 light, dark 색상 추가 (hover, active 상태 대응)
    • tertiary 제거, system colors(success, error) 공통 정의
    • grey scale colors 추가
  • App.tsx에 ThemeProvider 적용

3. SCSS 시스템 통합

  • _colors.scss에서 MUI 자동 생성 CSS 변수(--mui-palette-*) 참조
  • SCSS 변수 기반에서 CSS 변수 기반으로 전환

Test

  • 5가지 테마 전환 정상 작동 확인
  • 로딩 화면 테마 색상 정상 표시 확인
  • 기존 기능 영향 없음 확인

Improvement

  • 중앙 집중식 테마 관리
  • 일관된 스타일 적용: MUI 컴포넌트와 SCSS 컴포넌트가 동일한 색상 시스템 사용 가능
  • 참조 방식 통일 var(--color-*)

Next Task

  • 테마 시스템 변경으로 인한 ThemeSelector 리팩토링

- Reference MUI auto-generated CSS variables in _colors.scss
- Replace SCSS variables with CSS variables
- Add new CSS variables for color management
@nxnaxx nxnaxx self-assigned this Oct 23, 2025
@nxnaxx
nxnaxx requested review from a team as code owners October 23, 2025 16:25

@SingTheCode SingTheCode left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTMMM!!!! 고생하셨습니다ㅎㅎ

@yuminnnnni
yuminnnnni self-requested a review October 28, 2025 06:00

@yuminnnnni yuminnnnni left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

수고하셨습니다!! 👍

@nxnaxx
nxnaxx merged commit c036c40 into githru:main Oct 28, 2025
2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants